@charset "UTF-8";
//背景图片 example：@include bg2("icons/arrow-left.png"); 
@mixin bg2($URI,$x:0,$y:0){
        background: url('#{$image-base-path}#{$URI}') no-repeat $x $y;
        background-size: 100%;
    }

@mixin bg($url, $width: null, $height: null, $bgsize:100% 100%, $bgrepeat:no-repeat) {
    @if $width and $height {
        width: $width;
        height: $height;
    }
    background: url($url) $bgrepeat;
    background-size: $bgsize; 
}
//绝对定位
@mixin abs($pos1: left, $val1: 0, $pos2: top, $val2: 0, $type:absolute) {
    position: $type;
    #{$pos1}: $val1;
    #{$pos2}: $val2;
}
//绝对居中
@mixin center($width: null, $height: null, $pos: absolute) {
    position: $pos;
    top: 50%;
    left: 50%;
    @if not $width and not $height {
        transform: translate(-50%, -50%);
    }
    @else if $width and $height {
        width: $width;
        height: $height;
        margin: -($width / 2) #{0 0} -($height / 2);
    }
    @else if not $height {
        width: $width;
        margin-left: -($width / 2);
        transform: translateY(-50%);
    }
    @else {
        height: $height;
        margin-top: -($height / 2);
        transform: translateX(-50%);
    }
}
//文本溢出省略
@mixin ellipsis($num: 1) {
    overflow: hidden;
    text-overflow: ellipsis;
    @if($num == 2){
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    @else {
        white-space: nowrap;
    }
}


@mixin o-label($wh: 0.34rem) {
    position: relative;
    min-width: 1.4rem;
    height: $wh;
    line-height: $wh;
    display: inline-block;
    vertical-align: middle;
    white-space: nowrap;
    input {
        opacity: 0;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: $wh;
        cursor: pointer;
        z-index: 100;
    }
    input + span {
        display: inline-block;
        width: $wh;
        height: $wh;
        background-size: 100% !important;
    }
}